<template>
   <div class="searchlist">
      <div class="searchlist-item">
         <div class="search-box">
            <!-- label的for 属性，与input的id属性关联 -->
            <label for="hotels-name">目的地/酒店名称</label>
            <input type="text" id="hotels-name" placeholder="北京">
         </div>
      </div>

      <div class="searchlist-item">
         <div class="search-box">
            <label>入住时间/退房时间</label>
            <el-date-picker v-model="value1" type="daterange" range-separator="To" start-placeholder="Start date"
               end-placeholder="End date" :size="size" />
         </div>
      </div>

      <div class="searchlist-item">
         <div class="search-box">
            <label for="guest-in">房客及入住</label>
            <input class="search-box-input" type="text" id="guest-in" placeholder="1间/1位">
         </div>
      </div>

      <div class="searchlist-item">
         <div class="search-box">
            <label for="keyword">关键词(选填)</label>
            <input class="search-box-input" type="text" id="keyword" placeholder="火车、酒店名称或区域">
         </div>
      </div>

      <div class="searchlist-item">
         <el-button type="primary" :icon="Search"></el-button>
      </div>
   </div>
</template>




<script setup>
import {  Search} from '@element-plus/icons-vue'
</script>



<style scoped></style>